// 全局样式，默认开头 g-

/* theme color */
$--color-primary: #C27B55;
$--color-success: #13ce66;
$--color-warning: #ffba00;
$--color-danger: #ff4949;

// 常用
$com-border-radius: 12px;

// 输入框
$g-com-default-input-height: 48px;
// $g-com-default-input-bor-color: #EAEAEA;
// $g-com-hover-input-bor-color: #F5ECE5;
// $g-com-focus-input-bor-color: #C27B55;

// focus active
// $g-com-default-input-height: 48px;

/* input */
$--input-placeholder-color: #CCCCCC;
$--input-border: 1px solid #eaeaea;
$--input-hover-border: #F5ECE5;
$--input-focus-border: #C27B55;

/* select */
$--select-border-color-hover: #F5ECE5;
$--select-input-focus-border-color: #C27B55;

/* table */
$com_table-border-color: #F5F5F5;
$--table-border: 1px solid $com_table-border-color;

.g-bgc-fill-el-input {
  .el-input__inner {
    border-color: transparent;
    background-color: #F5F5F5;

    &:hover {
      border-color: $--input-hover-border;
      background-color: transparent;
    }

    &:focus {
      border-color: $--input-focus-border;
      background-color: transparent;
    }
  }

  .el-select {}

  .el-date-editor {
    .el-icon-date {
      display: none;
    }

    .el-input__inner {
      padding-left: 15px;
    }
  }

  .el-range-editor {
    &.is-active {
      border-color: $--color-primary;
      background-color: transparent;
    }

    .el-icon-date {
      display: none;
    }

    .el-range-input {
      background-color: transparent;
    }

    .el-range-separator {
      width: 16px;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;

      &::after {
        content: '';
        width: 9px;
        height: 1px;
        background: rgba(0, 0, 0, 0.2);
      }
    }
  }
}

// el-input
.el-input__inner {
  height: $g-com-default-input-height;
  line-height: $g-com-default-input-height;
}

/*
el-table

*/
.g-el-table {

  &.el-table,
  .el-table {
    width: 100%;
    border: $--table-border;
    border-bottom: none;
    border-top-left-radius: $com-border-radius;
    border-top-right-radius: $com-border-radius;

    .el-table__fixed-right {
      &::before {
        background-color: $com_table-border-color;
      }
    }

    &::before {
      background-color: $com_table-border-color;
    }

    th {
      font-weight: 400;
    }

    .el-table__header {
      tr {
        th {
          &:first-child {
            .cell {
              padding-left: 20px;
            }
          }

          &:last-child {
            .cell {
              padding-right: 20px;
            }
          }
        }
      }
    }

    .el-table__body {
      tr {
        td {
          &:first-child {
            .cell {
              padding-left: 20px;
            }
          }

          &:last-child {
            .cell {
              padding-right: 20px;
            }
          }
        }
      }
    }
  }
}